<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core">

<h:body>
	<ui:composition template="./plantilla/plantilla.xhtml">
		<ui:define name="center">
			<div class="h_title">#{main.listaClientes}</div>
			<h:form id="form" enctype="multipart/form-data">
				<p:growl id="grwCliente" showDetail="true" />
				<p:panel id="panellista" style="font-size:small;margin: auto">
					<p:dataTable id="dtbCliente" var="cliente" sortMode="multiple"
						rows="15" paginator="true" filterDelay="50" rendered="true"
						rowStyleClass="#{rowIndex mod 2 ne 0 ? 'row1' : 'null'}"
						rowIndexVar="rowIndex" resizableColumns="true" scrollWidth="true"
						paginatorPosition="bottom"
						value="#{clienteController.listaCliente}"
						style="width: 100%;float: center">

						<p:column headerText="#{main.codigo}" style="width:14%">
							<h:outputText value="#{cliente.codigo}" />
						</p:column>

						<p:column headerText="#{main.nombres}" style="width:16%"
							filterBy="#{cliente.nombres}" filterMatchMode="contains">
							<h:outputText value="#{cliente.nombres}" />
						</p:column>

						<p:column headerText="#{main.apellidos}" style="width:16%"
							filterBy="#{cliente.apellidos}" filterMatchMode="contains">
							<h:outputText value="#{cliente.apellidos}">
							</h:outputText>
						</p:column>

						<p:column headerText="#{main.fechaNacimiento}" style="width:14%">
							<h:outputText value="#{cliente.fechaNacimiento}">
								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</p:column>

						<p:column headerText="#{main.sexo}" filterMaxLength="1" filterStyle="width:25%" style="width:6%"
							filterBy="#{cliente.sexo}" filterMatchMode="contains">
							<h:outputText value="#{cliente.sexo}" />
						</p:column>

						<p:column headerText="#{main.puntosVigentes}" style="width:12%">
							<h:outputText value="#{cliente.puntosVigentes}" />
						</p:column>

						<p:column style="width:4%">
							<p:commandButton id="btnUpdCliente" icon="ui-icon-pencil"
								update=":form :formUpdCliente:pnlUpdCliente"
								title="#{main.ModificarCliente}" onclick="vdlgUpdCliente.show()">
								<f:setPropertyActionListener value="#{cliente}"
									target="#{clienteController.clienteSeleccionado}" />
							</p:commandButton>
						</p:column>

						<p:column style="width:4%">
							<h:commandLink title="Clientes">
								<p:graphicImage value="/resources/images/excel.png" />
							</h:commandLink>
						</p:column>

						<p:column style="width:4%">
							<p:commandButton id="btnHistorial" icon="ui-icon-pencil"
								title="#{main.HistorialCliente}">
							</p:commandButton>
						</p:column>
					</p:dataTable>
					<p:commandButton id="btnCrearCliente"
						onclick="vdlgCrearCliente.show()" value="#{main.crear}">
					</p:commandButton>
				</p:panel>
			</h:form>
			<h:form id="formCrearCliente" enctype="multipart/form-data">
				<h:inputHidden id="iphMaxCliente"
					value="#{clienteController.maxCodigo}"></h:inputHidden>
				<p:dialog id="dlgCrearCliente" header="#{main.registroCliente}"
					widgetVar="vdlgCrearCliente" resizable="false" position="center"
					width="900" modal="true" style="position:absolute;"
					showEffect="fade" hideEffect="fold">
					<h:panelGrid columns="6" id="pnlInsCliente" style="width:100%"
						cellpadding="5">
						<h:outputLabel value="#{main.nombres}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:inputText id="txtInsNombres" onchange="generarCodigo()"
							style="text-transform: capitalize;"
							value="#{clienteController.cliente.nombres}">
						</p:inputText>
						<h:outputLabel value="#{main.apellidos}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:inputText id="txtInsApellidos" onchange="generarCodigo()"
							style="text-transform: capitalize;"
							value="#{clienteController.cliente.apellidos}">
						</p:inputText>

						<h:outputLabel value="#{main.codigo}" />
						<h:outputLabel value=":" />
						<p:inputText id="txtInsCodigo"
							value="#{clienteController.cliente.codigo}" />

						<h:outputLabel value="#{main.fechaNacimiento}" />
						<h:outputLabel value=":" />
						<p:calendar id="dtFechaNacimiento" showButtonPanel="false"
							navigator="true" pattern="dd/MM/yyyy"
							value="#{clienteController.cliente.fechaNacimiento}" />

						<h:outputLabel value="#{main.pais}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:selectOneMenu value="#{clienteController.paisSeleccionado}"
							effect="fold" editable="true">
							<f:selectItems value="#{clienteController.listaPaises}" />
						</p:selectOneMenu>

						<h:outputLabel value="#{main.sexo}" />
						<h:outputLabel value=":" />
						<p:selectOneRadio id="sorInsSexo"
							value="#{clienteController.cliente.sexo}">
							<f:selectItem itemLabel="#{main.masculino}" itemValue="M" />
							<f:selectItem itemLabel="#{main.femenino}" itemValue="F" />
						</p:selectOneRadio>

						<h:outputLabel value="#{main.puntosVigentes}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:spinner id="spnInsPuntosVigentes" min="0" max="10"
							readonly="true"
							value="#{clienteController.cliente.puntosVigentes}" />
					</h:panelGrid>
					<h:panelGrid columns="3" id="pnlInsCliente02" style="width:98%"
						cellpadding="5">
						<h:outputLabel value="#{main.foto}" />
						<h:outputLabel value=":" />
						<h:panelGroup>
							<p:fileUpload id="uplInsFoto" mode="single"
								fileUploadListener="#{clienteController.subirFoto}"
								sizeLimit="512000" allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
								cancelLabel="#{main.cancelar}" uploadLabel="#{main.subirFoto}"
								label="#{main.elegir}" update="imgInsFoto"></p:fileUpload>
							<p:graphicImage id="imgInsFoto"
								value="#{clienteController.rutaFoto}" width="100" height="120"></p:graphicImage>
						</h:panelGroup>
						<p:spacer height="10" />
						<p:spacer height="10" />
						<p:spacer height="10" />
						<h:outputLabel />
						<h:outputLabel />
						<p:commandButton id="btnGrabarCliente" value="#{main.grabar}"
							title="Grabar" ajax="true"
							update=":form:dtbCliente, :form:grwCliente"
							actionListener="#{clienteController.grabarCliente}"
							style="background:#043f52;color:white;float:right;"
							onclick="vdlgCrearCliente.hide()">
						</p:commandButton>
					</h:panelGrid>
				</p:dialog>
			</h:form>

			<h:form id="formUpdCliente">
				<p:dialog id="dlgUpdCliente" header="#{main.modificacionCliente}"
					widgetVar="vdlgUpdCliente" resizable="false" position="center"
					width="400" modal="true" style="position:absolute;"
					showEffect="fade" hideEffect="fold">
					<h:panelGrid columns="3" id="pnlUpdCliente" style="width: 100%">
						<h:outputLabel value="#{main.codigo}" />
						<h:outputLabel value=":" />
						<p:inputText id="txtUpdCodigo"
							value="#{clienteController.clienteSeleccionado.codigo}" />

						<h:outputLabel value="#{main.nombres}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:inputText id="txtUpdNombres"
							value="#{clienteController.clienteSeleccionado.nombres}" />

						<h:outputLabel value="#{main.apellidos}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:inputText id="txtUpdApellidos"
							value="#{clienteController.clienteSeleccionado.apellidos}" />

						<h:outputLabel value="#{main.fechaNacimiento}" />
						<h:outputLabel value=":" />
						<p:calendar id="dtFechaNacimiento" showButtonPanel="true"
							navigator="true"
							value="#{clienteController.clienteSeleccionado.fechaNacimiento}" />

						<h:outputLabel value="#{main.pais}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:inputText id="txtUpdPais"
							value="#{clienteController.clienteSeleccionado.pai.nombre}" />

						<h:outputLabel value="#{main.sexo}" />
						<h:outputLabel value=":" />
						<p:selectOneRadio id="sorUpdSexo"
							value="#{clienteController.clienteSeleccionado.sexo}">
							<f:selectItem itemLabel="#{main.masculino}" itemValue="M" />
							<f:selectItem itemLabel="#{main.femenino}" itemValue="F" />
						</p:selectOneRadio>

						<h:outputLabel value="#{main.puntosVigentes}" styleClass="colum" />
						<h:outputLabel value=":" styleClass="colum" />
						<p:spinner id="spnUpdPuntosVigentes" min="0" max="10"
							readonly="true"
							value="#{clienteController.clienteSeleccionado.puntosVigentes}" />

						<p:spacer height="10" />
						<p:spacer height="10" />
						<p:spacer height="10" />
						<h:outputLabel />
						<h:outputLabel />
						<p:commandButton id="btnModifcarCliente" value="#{main.grabar}"
							title="Grabar" ajax="true"
							update=":form:dtbCliente, :form:grwCliente"
							actionListener="#{clienteController.grabarCliente}"
							style="background:#043f52;color:white;float:right;"
							onclick="vdlgUpdCliente.hide()">
						</p:commandButton>
					</h:panelGrid>
				</p:dialog>
			</h:form>
		</ui:define>
	</ui:composition>
</h:body>
</html>
